<template>
	<view>
		<uni-search-bar placeholder="输入姓名" @confirm="search1" @cancel="search2"/>
		
		<view class="uni-list list">
			<checkbox-group @change="checkboxChange">
				<label class="uni-list-cell" v-for="item in list" :key="item.id">
					<view class="checkbox-cell">
						<checkbox :value="item.id" :checked="item.checked" />
					</view>
					<view class="content-cell">
						<view class="item-content" v-if="type=='delegate'">
							<view class="item-detail"><strong>姓名：</strong>{{ item.name }}</view>
							<view class="item-detail"><strong>账号：</strong>{{ item.account }}</view>
						</view>
						<view class="item-content" v-else>
							<view class="item-detail"><strong>人员账号：</strong>{{ item.account }}</view>
							<view class="item-detail"><strong>姓名：</strong>{{ item.name }}</view>
							<view class="item-detail"><strong>部门：</strong>{{ item.orgName }}</view>
						</view>
					</view>
				</label>
			</checkbox-group>
		</view>
		
		<view class="button-groups">
			<button class="func-btn" @click="doSure">{{$t('baseCommon.buttons.confirm')}}</button>
		</view>
	</view>
</template>

<script>
	import { queryUserByGroup, queryDataByKey, query4Org } from '@/api/platform/common.js'
	import { notice } from '@/utils/common.js'
	
	export default {
		data() {
			return {
				type: '',
				groupId: '',
				list: [],
				allList: [],
				checkedList: []
			}
		},
		onLoad(params) {
			this.type = params.type
			this.groupId = params.groupId ? params.groupId : ""
			this.init()
		},
		methods: {
			init() {
				let reqServer
				let params = []
				if(this.type == "normal"){
					reqServer = queryUserByGroup
					params.push({
						key: "Q^GROUP_ID_^SL",
						value: this.groupId
					})
				}else if(this.type == "delegate"){
					reqServer = query4Org
				}else{
					reqServer = queryDataByKey
					params.push({
						key: "Q^MAIN_PID_^SL",
						value: this.groupId
					})
					params.push({
						key: "key",
						value: "czfzrxz"
					})
				}

				reqServer(params).then(res=>{
					res.data.dataResult.forEach(item=>{
						if(!item.account) {
							item.account = item.id
						}
						this.list.push(item)
						this.allList.push(item)
					})
				})
			},
			search1(e) {
				if(e.value){
					var that = this
					var data = that.allList
					that.list = []
					for (var i = 0, len = data.length; i < len; i++) {
						if (data[i].name.indexOf(e.value) >= 0) {
							that.list.push(data[i])
						}
					}
				}else{
					this.init()
				}
			},
			search2(e) {
				this.list = []
				this.init()
			},
			checkboxChange(e) {
				var items = this.list,
				values = e.detail.value;
				for (var i = 0, lenI = items.length; i < lenI; ++i) {
					const item = items[i]
					if(values.indexOf(item.id) >= 0){
						this.$set(item,'checked',true)
					}else{
						this.$set(item,'checked',false)
					}
				}
			},
			doSure() {
				let _this = this
				_this.list.forEach(item=>{
					if(item.checked == true) {
						item.type = 'employee'
						item.groupType = ''
						_this.checkedList.push(item);
					}
				})
				if(_this.checkedList.length === 0) {
					notice.toast("请选择人员")
					return
				}
				var pages = getCurrentPages();
				var prevPage = pages[pages.length - 2]; //上一个页面
				prevPage.$vm.reciveUser(_this.type, _this.checkedList);
				uni.navigateBack();
			}
		}
	}
</script>

<style>
	.list {
		padding-bottom: 44px;
	}
	
	.uni-list-cell {
	    display: flex;
	    align-items: center;
		border-bottom: 1px solid #ebedf0;
		padding: 10px;
	}
	
	.checkbox-cell {
		width: 15%;
		padding-left: 15px;
	}
	
	.content-cell {
		width: 85%;
	}
	
	.item-content {
		width: 100%;
	}
	
	.item-detail {
	    line-height: 24px;
	    font-size: 14px;
	}
	
	.button-groups {
		position: fixed;
		bottom: 0;
		width: 100%;
		z-index: 100;
	}
	
	.func-btn {
		background-color: #1E91E6;
		height: 44px;
		line-height: 42px;
		font-size: 16px;
		color: #fff;
		border-radius: 0;
	}
</style>
